<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
	<meta name="format-detection" content="telephone=no">
	<meta name="author" content="演示SHOP Team">
	<meta name="copyright" content="演示SHOP">
	<title>${message("member.profile.edit")}[#if showPowered] - 演示电商[/#if]</title>
	<link href="${base}/favicon.ico" rel="icon">
	<link href="${base}/resources/common/css/bootstrap.css" rel="stylesheet">
	<link href="${base}/resources/common/css/font-awesome.css" rel="stylesheet">
	<link href="${base}/resources/common/css/iconfont.css" rel="stylesheet">
	<link href="${base}/resources/common/css/awesome-bootstrap-checkbox.css" rel="stylesheet">
	<link href="${base}/resources/common/css/bootstrap-datetimepicker.css" rel="stylesheet">
	<link href="${base}/resources/common/css/base.css" rel="stylesheet">
	<link href="${base}/resources/mobile/member/css/base.css" rel="stylesheet">
	<!--[if lt IE 9]>
		<script src="${base}/resources/common/js/html5shiv.js"></script>
		<script src="${base}/resources/common/js/respond.js"></script>
	<![endif]-->
	<script src="${base}/resources/common/js/jquery.js"></script>
	<script src="${base}/resources/common/js/bootstrap.js"></script>
	<script src="${base}/resources/common/js/bootstrap-growl.js"></script>
	<script src="${base}/resources/common/js/jquery.scrolltofixed.js"></script>
	<script src="${base}/resources/common/js/moment.js"></script>
	<script src="${base}/resources/common/js/bootstrap-datetimepicker.js"></script>
	<script src="${base}/resources/common/js/jquery.lSelect.js"></script>
	<script src="${base}/resources/common/js/jquery.validate.js"></script>
	<script src="${base}/resources/common/js/jquery.validate.additional.js"></script>
	<script src="${base}/resources/common/js/jquery.form.js"></script>
	<script src="${base}/resources/common/js/jquery.cookie.js"></script>
	<script src="${base}/resources/common/js/underscore.js"></script>
	<script src="${base}/resources/common/js/url.js"></script>
	<script src="${base}/resources/common/js/base.js"></script>
	<script src="${base}/resources/mobile/member/js/base.js"></script>
	[#noautoesc]
		[#escape x as x?js_string]
			<script>
			$().ready(function() {
				var IntervalCount = 120;//验证码有效时间
				var $inputForm = $("#inputForm");

				var $getSmsCode = $("[data-action='getSmsCode']");
				var countdown;
				var count=IntervalCount;
				$getSmsCode.click(function() {
					count=IntervalCount;
					$getSmsCode.attr("disabled", true);
					var vipCard=$("#vipCard").val();
					if(vipCard===null||vipCard===''){
						$getSmsCode.attr("disabled", false);
						return false;
					}
					$.ajax({
						url: "${base}/member/profile/getSmsCode?vipCard="+vipCard,
						type: "GET",
						dataType: "json",
						cache: false,
						success: function(data) {
							countdown = setInterval(CountDown, 1000);
							localStorage.setItem("vipCard",vipCard);
						}
					});


				});
				var countdowns=localStorage.countdown;
				if(countdowns>0){
					var vipCard=localStorage.vipCard;
					$("#vipCard").val(vipCard);
					count=countdowns;
					countdown = setInterval(CountDown, 1000);
				}
				function CountDown() {
					$getSmsCode.attr("disabled", true);
					$getSmsCode.text(" "+count+"s ");
					localStorage.setItem("countdown",count);
					if (count == 0) {
						clearInterval(countdown);
						$getSmsCode.text('${message("member.login.getCaptcha")}')
						$getSmsCode.removeAttr("disabled");
						localStorage.removeItem("countdown");
						localStorage.removeItem("vipCard");
					}else{
						count--;
					}
				}

				// 表单验证
				$inputForm.validate({
					rules: {
						vipCard: {
							required: true
						},
						smsCode: {
							required: true
						}

					},
					submitHandler: function(form) {
						$(form).ajaxSubmit({
							successMessage: false,
							successRedirectUrl: function(redirectUrlParameterName) {
								localStorage.removeItem("countdown");
								clearInterval(countdown);
								return  "${base}/member/profile/edit";
							}
						});
						[#--$(form).ajaxSubmit({--]
						[#--	successRedirectUrl: "${base}/member/profile/edit"--]
						[#--});--]
					}
				});
			
			});
			</script>
		[/#escape]
	[/#noautoesc]
</head>
<body class="member">
	<header class="header-default" data-spy="scrollToFixed">
		<div class="container-fluid">
			<div class="row">
				<div class="col-xs-1">
					<a href="${base}/member/profile/edit">
						<i class="iconfont icon-back"></i>
					</a>
				</div>
				<div class="col-xs-10">
					<h5>${message("member.profile.binding")}</h5>
				</div>
			</div>
		</div>
	</header>
	<main>
		<div class="container-fluid">
			<form id="inputForm" class="ajax-form" action="${base}/member/profile/bindingCard" method="post">
				<input name="id" type="hidden" value="${receiver.id}">
				<div class="panel panel-default">
					<div class="panel-body">
						<div class="form-group">
							<label class="" for="mobile">姓名：${currentUser.name}</label>
						</div>
						<div class="form-group">
							<label class="" for="email">${message("common.captcha.vipCard")}:</label>
							<input id="vipCard"  name="vipCard" class="form-control" style="width: 70%;" type="text" value="${currentUser.attributeValue0}" maxlength="32">
							<button  class="btn btn-primary" data-action="getSmsCode" style="width: 25%;float: right;margin-top: -32px" type="button">${message("member.login.getCaptcha")}</button>
						</div>
						<div class="form-group">
							<label class="" for="mobile">${message("common.captcha.name")}</label>
							<input id="smsCode"  name="smsCode" class="form-control" type="text" value="" maxlength="10">
						</div>

					</div>
					<div class="panel-footer text-center">
						<button  class="btn btn-primary" type="submit">${message("common.bindingVip")}</button>
					</div>
				</div>
			</form>
		</div>
	</main>
</body>
</html>